<!DOCTYPE html>
<script src="../../resources/check-layout.js"></script>
<p>There should be two words below, on separate lines, with large letter spacing. The first line
    should read "SART". The second one should read "KU". There should be a hotpink <em>square</em>
    to the right of the second line, but nowhere else.</p>
<div id="outer" data-expected-height="64" style="position:relative; -webkit-columns:2; -webkit-column-gap:0; font-size:16px; width:4em; line-height:2em; text-align:center; background:hotpink;">
    <div style="-webkit-columns:2; -webkit-column-gap:0;">
        <div data-offset-x="0"  data-offset-y="0"  style="background:white;">S</div>
        <div data-offset-x="0"  data-offset-y="32" style="background:white;">K</div>
        <div data-offset-x="16" data-offset-y="0"  style="background:white;">A</div>
        <div data-offset-x="16" data-offset-y="32" style="background:white;">U</div>
        <div data-offset-x="32" data-offset-y="0"  style="background:white;">R</div>
        <div data-offset-x="48" data-offset-y="0"  style="background:white;">T</div>
    </div>
</div>
<script>
    checkLayout("#outer");
</script>
